<template>
	<view class="page">
		<uni-card class="page-card" title="视频">
			<uni-list class="page-list" :border="false">
				<uni-list-item title="看全网" 
					class="page-item" 
					:border="false" 
					clickable
					@click="onVideo('a')"
				/>
				<uni-list-item 
					title="线路1" 
					class="page-item" 
					clickable
					:border="false" 
					@click="onVideo('b')"
				/>
				<uni-list-item 
					title="线路2" 
					class="page-item" 
					clickable
					:border="false" 
					@click="onVideo('c')"
				/>
			</uni-list>
		</uni-card>
		
		<uni-card class="page-card" title="游戏">
			<uni-list class="page-list" :border="false">
				<uni-list-item title="2048"
					class="page-item" 
					:border="false" 
					clickable
					@click="onGame('2048')"
				/>
				<uni-list-item title="俄罗斯方块"
					class="page-item" 
					:border="false" 
					clickable
					@click="onGame('俄罗斯方块')"
				/>
				<uni-list-item title="双人五子棋"
					class="page-item" 
					:border="false" 
					clickable
					@click="onGame('双人五子棋')"
				/>
				<uni-list-item title="五子棋"
					class="page-item" 
					:border="false" 
					clickable
					@click="onGame('五子棋')"
				/>
				<uni-list-item title="围棋"
					class="page-item" 
					:border="false" 
					clickable
					@click="onGame('围棋')"
				/>
			</uni-list>
		</uni-card>
		
		<uni-card class="page-card" title="其他">
			<uni-list class="page-list" :border="false">
				<uni-list-item title="AIchat|gpt"
					class="page-item" 
					:border="false" 
					clickable
					@click="onOther('gpt')"
				/>
			</uni-list>
		</uni-card>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pathEnum: {
					a :'https://www.dilidili4.com',
					b :'http://v.ddtu8.com',
					c :'https://www.sjzhcheng.com',
				},
				titleEnum: {
					a: '看全网',
					b: '备选路线1',
					c: '备选路线2',
				},
				gameEnum: {
					'2048': '/pages/game/2048/index',
					'五子棋': '/pages/game/gobang/home',
					'双人五子棋': '/pages/game/gobang/index',
					'俄罗斯方块': '/pages/game/tetris/index',
					'围棋': '/pages/game/gobang/index',
				},
				AISiteEnum: {
					'gpt': 'https://chat18.aichatos.xyz/#/chat/1705544965233',	
				}
			}
		},
		methods: {
			onVideo(path='a') {
				const res = `/pages/browser/index?url=${this.pathEnum[path] || this.pathEnum.c}`
				uni.navigateTo({
					url: res
				});
			},
			onGame(name='2048'){
				uni.navigateTo({
					url: this.gameEnum[name]
				});
			},
			onOther(path){
				const res = `/pages/browser/index?url=${this.AISiteEnum[path] || this.AISiteEnum.gpt}`
				uni.navigateTo({
					url: res
				});
			},
		}
	}
</script>

<style>
	.page {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		min-width: 100vw;
		min-height: 100vh;
		overflow-y: auto;
		background-color: #faebd7;
		padding: 20px 40px 20vh;
		box-sizing: border-box;
	
	}
	
	.page-card {
		width: 100%;
		background-color: rgba(245,245,235,.2);
		border-radius: 8px;
		height: max-content;
		margin: 0;
		padding: 0;
	}
	
	.page-list {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		background-color: transparent;
	}
	
	.page-item {
		flex: 0 0 auto; 
		width: 85px; 
		height: 85px;
		background-color: transparent;
		margin: 4px;
		border-radius: 8px;
	}
	
	
</style>
